<template>
	<view class="notice">
    <statusBar></statusBar>
    <logo :back="true" :noticeUrl="'../../../tarbar/user/notice/notice'"></logo>
		<view style="height:10px;background-color: #f2f2f2;"></view>
    <view class="uni-padding-wrap uni-common-mt">
      <uni-segmented-control :current="current" :values="items" v-on:clickItem="onClickItem" :styleType="styleType" :activeColor="activeColor"></uni-segmented-control>
    </view>
    <view style="height:10px;background-color: #f2f2f2;"></view>
    <view class="content">
      <view v-show="current === 0">
        <view class="noticelist" @click="goNoticeContent(item)" v-for="(item,index) in examList" :key="index"><text class="notelist-name">{{item.Name}}</text><text class="noticelist-time">{{item.oneDate}} {{item.twoDate}}</text></view>
      </view>
      <view v-show="current === 1">
        <view class="noticelist" @click="goNoticeContent(item)" v-for="(item,index) in sysList" :key="index"><text class="notelist-name">{{item.Name}}</text><text class="noticelist-time">{{item.oneDate}} {{item.twoDate}}</text></view>
      </view>
    </view>
    <uni-popup :show="type === 'middle'" position="middle" mode="fixed" :msg="msg" @hidePopup="togglePopup('')"></uni-popup>
	</view>
</template>

<script>
  import statusBar from "@/components/status-bar.vue"
  import logo from '@/components/logo.vue'
  import uniSegmentedControl from '@/components/uni-segmented-control/uni-segmented-control.vue'
	export default {
    components: {
      logo,
      uniSegmentedControl,
      statusBar
    },
		data() {
			return {
				items: ['考试通知', '系统公告'],
        type: '',
				current: 0,
				styleType: 'text',
				activeColor: '#27B28B',
        sysList: [],
        examList: []
			};
		},
    onShow() {
      if(uni.getStorageSync('token') == null || uni.getStorageSync('token') == undefined || uni.getStorageSync('token') == ''){
        uni.reLaunch({
          url: '../../../login/login'
        });
      }else{
         this.getNotice();
      }
    },
    created() {
    	this.getNotice();
    },
    methods:{
      getNotice: function(){
        uni.request({
          method: 'Get',
          header: {
            'Content-Type': 'application/json',
            'Authorization': uni.getStorageSync('token')
          },
          url: this.apiUrl + 'api/student/Notice/GetNotice', 
          data: {
            limit: "10000",
            page: "1",
            type: "1"  //0系统公告 1 考试公告
          },
          success: res => {
            if(res.data.state == "success"){
             this.examList = res.data.data.noticeList;
             for(var i = 0; i < this.examList.length; i++){
               this.examList[i].oneDate = this.examList[i].CreateTime.substr(0,10);
               this.examList[i].twoDate = this.examList[i].CreateTime.substr(11,8);
             }
            }else{
              this.msg = '未知错误';
              this.togglePopup('middle');
            }
          }
        });
        uni.request({
          method: 'Get',
          header: {
            'Content-Type': 'application/json',
            'Authorization': uni.getStorageSync('token')
          },
          url: this.apiUrl + 'api/student/Notice/GetNotice', 
          data: {
            limit: "10000",
            page: "1",
            type: "0"  //0系统公告 1 考试公告
          },
          success: res => {
            if(res.data.state == "success"){
             this.sysList = res.data.data.noticeList;
             for(var i = 0; i < this.sysList.length; i++){
               this.sysList[i].oneDate = this.sysList[i].CreateTime.substr(0,10);
               this.sysList[i].twoDate = this.sysList[i].CreateTime.substr(11,8);
             }
            }else{
              this.msg = '未知错误';
              this.togglePopup('middle');
            }
          }
        });
      },
      goNoticeContent: function(item){
        item.threeDate = item.oneDate + ' ' + item.twoDate;
        uni.navigateTo({
        	url: 'noticecontent?name='+ item.Name +'&person='+ item.CreatePerson +'&content='+ item.Content +'&time='+ item.threeDate +'&id='+ item.NoticeId +''
        })
      },
      onClickItem(index) {
        if (this.current !== index) {
          this.current = index;
        }
      },
    }
	}
</script>

<style scoped>
  .line{
    height: 15upx;
  }
  .uni-padding-wrap {
    background-color: #fff;
  }
  .segmented-control {
    width: 100% !important;
  }
  .segmented-control-item {
    line-height: 40px !important;
  }
  .content{
    background-color: #F2F2F2;
  }
  .noticelist{
    padding-left: 15upx;
    height: 48px;
    line-height: 48px;
    font-size: 13px;
    color: #474747;
    background-color: #FFFFFF;
    margin-bottom: 10upx;
  }
  .notelist-name{
    display: inline-block;
    width: 360upx;
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
  }
  .noticelist-time{
    font-size: 13px;
    color: #474747;
    float: right;
    margin-right: 65upx;
    position: relative;
  }
  .noticelist-time::after{
    border: solid 2px #c8c8cd;
    border-bottom-width: 0;
    border-left-width: 0;
    content: " ";
    top: 50%;
    right: -15px;
    position: absolute;
    width: 5px;
    height: 5px;
    -webkit-transform: translateY(-50%) rotate(45deg);
    transform: translateY(-50%) rotate(45deg);
  }

</style>
